<!--
  客户管理
 -->

<template>
  <BaseMainSlot>
    <template v-slot:btn-box>
      <ActionBar
        :page-no="62"
        :add-active="addActive"
        :del-active="delActive"
        :edit-active="editActive"
        :cancel-active="cancelActive"
        :save-active="saveActive"
        :has-edit="false"
        :has-save="false"
        :has-cancel="false"
        @add="add"
        @cancel="cancel('formData', 'tableData')"
        @edit="edit"
        @del="del"
        @save="save('formData')"
      />
    </template>
    <template v-slot:search-box>
      <SearchBox @search="search">
        <div class="common-search-item">
          <div class="label">客户名称:</div>
          <div class="input">
            <el-input v-model="searchInfo.customerName" />
          </div>
        </div>
        <div class="common-search-item">
          <div class="label">统一社会信用代码:</div>
          <div class="input">
            <el-input v-model="searchInfo.creditCode" />
          </div>
        </div>
        <div class="common-search-item">
          <div class="label">地址:</div>
          <div class="input">
            <el-input v-model="searchInfo.address" />
          </div>
        </div>
        <div class="common-search-item">
          <div class="label">负责人:</div>
          <div class="input">
            <el-input v-model="searchInfo.charge" />
          </div>
        </div>
        <div class="common-search-item">
          <div class="label">联系方式:</div>
          <div class="input">
            <el-input v-model="searchInfo.contactNumber" />
          </div>
        </div>
        <div class="common-search-item">
          <div class="label">银行账号:</div>
          <div class="input">
            <el-input v-model="searchInfo.bankAccount" />
          </div>
        </div>
        <div class="common-search-item">
          <div class="label">开户行:</div>
          <div class="input">
            <el-input v-model="searchInfo.openingBank" />
          </div>
        </div>
      </SearchBox>
    </template>
    <template v-slot:table-box>
      <el-table
        ref="tableData"
        v-loading="loading"
        :data="tableData"
        stripe
        border
        height="calc(100% - 50px)"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="55" />
        <el-table-column type="index" label="序号" width="50" />
        <el-table-column prop="customerName" label="客户名称" min-width="140" />
        <el-table-column prop="creditCode" label="统一社会信用代码" min-width="140" />
        <el-table-column prop="address" label="供应商地址" min-width="140">
          <template
            v-if="scope.row.customerNo"
            slot-scope="scope"
          >{{ scope.row.address? scope.row.address.split(',').join('') :'' }}{{ scope.row.detailedAddress }}</template>
        </el-table-column>
        <el-table-column prop="charge" label="负责人" min-width="80" />
        <el-table-column prop="contactNumber" label="客户联系电话" />
        <el-table-column prop="bankAccount" label="银行账号" />
        <el-table-column prop="openingBank" label="开户行" />
        <el-table-column prop="supplyProducts" label="营业执照">
          <template v-if="scope.row.customerNo" slot-scope="scope">
            <el-button
              v-if="scope.row.customerBusinessLicenseNoList.length"
              class="text-btn-cursor"
              type="text"
              size="small"
              @click="showimgmet(scope.row)"
            >查看</el-button>
            <span v-else>暂无</span>
          </template>
        </el-table-column>
        <el-table-column label="客户主要购买产品" width="180">
          <template v-if="scope.row.customerNo" slot-scope="scope">
            <el-button
              v-if="judgePermission(62, 'edit')"
              class="text-btn-cursor"
              type="text"
              size="small"
              @click="checkProductList(scope.row, false)"
            >查看产品</el-button>
            <el-button
              v-if="judgePermission(62, 'edit')"
              class="text-btn-cursor"
              type="text"
              size="small"
              @click="checkProductList(scope.row, true)"
            >修改产品</el-button>
          </template>
        </el-table-column>
        <el-table-column label="操作" width="120">
          <template v-if="scope.row.customerNo" slot-scope="scope">
            <el-button
              v-if="judgePermission(62, 'edit')"
              class="text-btn-cursor"
              type="text"
              size="small"
              @click="handleEdit(scope.row)"
            >
              <i class="el-icon-edit-outline"></i> 修改
            </el-button>
            <el-button
              v-if="judgePermission(62, 'delete')"
              class="text-btn-cursor cursor-delete"
              type="text"
              size="small"
              @click="handleDelete(scope.row)"
            >
              <i class="el-icon-delete"></i> 删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <Pagination
        :page-size="pageSize"
        :current-page="currentPage"
        :total-size="totalSize"
        @changePageSize="changePageSize"
        @changeCurrentPage="changeCurrentPage"
      />
    </template>

    <template v-slot:dialog>
      <!-- 展示图片 -->
      <el-dialog title="执照图片" :visible.sync="isshowimg" width="30%">
        <img :src="nowimgurl" width="100%" height="auto" />
      </el-dialog>

      <el-dialog
        :title="dialogTitle + '客户信息'"
        :visible.sync="dialogFormVisible"
      >
        <el-form
          ref="formData"
          label-position="left"
          :model="formData"
          :rules="rules"
          class="el-form"
        >
          <el-form-item label="客户名称:" prop="customerName" class="w50p">
            <el-input v-model="formData.customerName" placeholder="请输入客户名称" />
          </el-form-item>
          <el-form-item label="负责人:" prop="charge" class="w50p">
            <el-input v-model="formData.charge" placeholder="请输入负责人名称" />
          </el-form-item>
          <el-form-item label="负责人电话:" prop="contactNumber" class="w50p">
            <el-input v-model="formData.contactNumber" placeholder="请输入负责人电话" />
          </el-form-item>
          <el-form-item label="纳税人识别号:" prop="creditCode" class="w50p">
            <el-input v-model="formData.creditCode" placeholder="请输入纳税人识别号" />
          </el-form-item>
          <el-form-item label="银行账号:" prop="bankAccount" class="w50p">
            <el-input v-model="formData.bankAccount" placeholder="请输入银行账号" />
          </el-form-item>
          <el-form-item label="开户行:" prop="openingBank" class="w50p">
            <el-input v-model="formData.openingBank" placeholder="请输入开户行" />
          </el-form-item>
          <el-form-item label="地址:" class="w100p" prop="detailedAddress">
            <el-form-item class="w50p">
              <el-cascader
                v-model="selectedOptions"
                placeholder="请选择省市区"
                size="large"
                :options="options"
                clearable
                @change="handleChange"
              />
            </el-form-item>
            <div style="margin: 0 10px"></div>
            <el-form-item class="w50p">
              <el-input
                v-model="formData.detailedAddress"
                placeholder="请输入详细地址"
                clearable
              />
            </el-form-item>
          </el-form-item>
          <el-form-item label="营业执照:" prop="pictureNo" class="w100p">
            <ele-upload-image
              v-model="image"
              multiple
              :response-fn="handleResponse"
              :before-remove="handleRemove"
              :headers="headers"
              :action="ImageUrl()"
            />
          </el-form-item>

          <el-row>
            <h4 class="total-price">
              <span>购入物料:</span>
              <!-- <span> 销售总金额:{{ totalAmount }}元</span> -->
            </h4>
            <el-table
              ref="rightTableData"
              :data="rightTableData"
              tooltip-effect="dark"
              highlight-current-row
              border
              stripe
              class="rightTableData"
            >
              <el-table-column type="index" label="序号" width="50" />
              <el-table-column prop="goodsNo" label="产品">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.goodsNo"
                    clearable
                    @change="chooseProduct(scope)"
                  >
                    <el-option
                      v-for="(item,index) in productList"
                      :key="index"
                      :label="item.productName"
                      :value="item.productNo"
                    />
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column prop="goodsName" label="产品名称" />
              <el-table-column prop="specification" label="规格">
                <template
                  slot-scope="scope"
                >{{ scope.row.specification }} {{ scope.row.perSpecUnitName }}/{{ scope.row.unitName }}</template>
              </el-table-column>
              <el-table-column prop="model" label="型号" />
              <!-- <el-table-column prop="perSpecUnitName" label="产品编码" /> -->
              <el-table-column prop="unitPrice" label="产品单价">
                <template slot-scope="scope">
                  <el-input v-model="scope.row.unitPrice" />
                </template>
              </el-table-column>
              <el-table-column prop="setNum" label="起订数量">
                <template slot-scope="scope">
                  <el-input v-model="scope.row.setNum" />
                </template>
              </el-table-column>
              <el-table-column prop="status" label="产品状态">
                <template slot-scope="scope">
                  <el-select v-model="scope.row.status" clearable>
                    <el-option value="在售" />
                    <el-option value="停售" />
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column label="操作">
                <template slot-scope="scope">
                  <el-button
                    type="text"
                    style="color:red;text-decoration: underline;"
                    :disabled="!canInput"
                    size="small"
                    @click.native.prevent="deleteRow(scope.$index, rightTableData)"
                  >删除</el-button>
                </template>
              </el-table-column>
              <template slot="empty">
                <div>请添加数据</div>
              </template>
            </el-table>
          </el-row>
          <el-row>
            <el-button
              type="info"
              plain
              :disabled="!canInput"
              icon="el-icon-circle-plus-outline"
              class="addInfo"
              @click="addButInfo"
            >添加</el-button>
          </el-row>
        </el-form>
        <div v-if="nowChanceStau !== ''" slot="footer" class="dialog-footer">
          <el-button class="zh-button-one" @click="cancel('formData')">取 消</el-button>
          <el-button
            class="zh-button-two"
            type="primary"
            @click="save('formData')"
          >保 存</el-button>
        </div>
      </el-dialog>

      <el-dialog :title="'产品信息'" :visible.sync="dialogProductFormVisible">
        <el-row>
          <h4 class="total-price">
            <span>购入物料:</span>
            <!-- <span> 销售总金额:{{ totalAmount }}元</span> -->
          </h4>
          <el-table
            ref="rightTableData"
            :data="rightTableData"
            tooltip-effect="dark"
            highlight-current-row
            border
            stripe
            class="rightTableData"
          >
            <el-table-column type="index" label="序号" width="50" />
            <el-table-column prop="goodsNo" label="产品">
              <template slot-scope="scope">
                <el-select
                  v-model="scope.row.goodsNo"
                  clearable
                  @change="chooseProduct(scope)"
                >
                  <el-option
                    v-for="(item,index) in productList"
                    :key="index"
                    :label="item.productName"
                    :value="item.productNo"
                  />
                </el-select>
              </template>
            </el-table-column>
            <el-table-column prop="goodsName" label="产品名称" />
            <el-table-column prop="specification" label="规格">
              <template
                slot-scope="scope"
              >{{ scope.row.specification }} {{ scope.row.perSpecUnitName }}/{{ scope.row.unitName }}</template>
            </el-table-column>
            <el-table-column prop="model" label="型号" />
            <!-- <el-table-column prop="perSpecUnitName" label="产品编码" /> -->
            <el-table-column prop="unitPrice" label="产品单价">
              <template slot-scope="scope">
                <el-input v-model="scope.row.unitPrice" />
              </template>
            </el-table-column>
            <el-table-column prop="setNum" label="起订数量">
              <template slot-scope="scope">
                <el-input v-model="scope.row.setNum" />
              </template>
            </el-table-column>
            <el-table-column prop="status" label="产品状态">
              <template slot-scope="scope">
                <el-select v-model="scope.row.status" clearable>
                  <el-option value="在售" />
                  <el-option value="停售" />
                </el-select>
              </template>
            </el-table-column>
            <el-table-column label="操作">
              <template slot-scope="scope">
                <el-button
                  type="text"
                  style="color:red;text-decoration: underline;"
                  :disabled="!canInput"
                  size="small"
                  @click.native.prevent="deleteRow(scope.$index, rightTableData)"
                >删除</el-button>
              </template>
            </el-table-column>
            <template slot="empty">
              <div>请添加数据</div>
            </template>
          </el-table>
        </el-row>
        <el-row>
          <el-button
            type="info"
            plain
            :disabled="!canInput"
            icon="el-icon-circle-plus-outline"
            class="addInfo"
            @click="addButInfo"
          >添加</el-button>
        </el-row>
        <div slot="footer" class="dialog-footer">
          <el-button
            class="zh-button-one"
            @click="closeCheckProduct('formData')"
          >取 消</el-button>
          <el-button
            v-if="canInput"
            class="zh-button-two"
            type="primary"
            @click="saveProduct('formData')"
          >保 存</el-button>
        </div>
      </el-dialog>
    </template>
  </BaseMainSlot>
</template>

<script>
import ActionBar from "@/components/ActionBar";
import Pagination from "@/components/Pagination";
// import collectionPicture from "@/api/digital-production/collectionPicture";
import { regionData, CodeToText, TextToCode } from "element-china-area-data";
import customerManage from "@/api/digital-operation/sell-order-manage/customer-manage";
import BaseMainSlot from "@/components/BaseMainSlot/newBaseMainSlot";
import SearchBox from "@/components/SearchBox";
import { mymixin } from "@/utils/mixin";
import baseURL from "@/api/baseURL";
import productManage from "@/api/basic-info-manage/product-manage";
import { mapGetters } from "vuex";

export default {
  name: "CustomerManage",
  components: {
    ActionBar,
    Pagination,
    BaseMainSlot,
    SearchBox
  },
  mixins: [mymixin],
  data() {
    return {
      searchInfo: {},
      // 采购物品
      goodsId: "",
      goodsList: [],
      // 名称
      name: "",
      nameList: [],
      // 选择时间
      startTime: "",
      endTime: "",
      // 日 月 周
      rulesTime: "",
      rightTableData: [],
      curRow: null,
      tempFormData: null,
      customerId: "",
      options: regionData,
      // 地址
      addtions: {},
      CustomerList: [],
      rules: {
        customerName: [
          {
            required: true,
            message: "请输入客户名称",
            trigger: "blur"
          },
          {
            pattern: /[\u4e00-\u9fa5]/g,
            message: "请输入中文",
            trigger: "blur"
          }
        ],
        charge: [
          {
            required: true,
            message: "请输入负责人名称",
            trigger: "blur"
          },
          {
            pattern: /[\u4e00-\u9fa5]/g,
            message: "请输入中文",
            trigger: "blur"
          }
        ],
        contactNumber: [
          {
            required: true,
            message: "请输入手机号码",
            trigger: "blur"
          },
          {
            pattern: /^((0\d{2,3}-\d{7,8})|(1\d{10}))$/,
            message: "请输入合法手机号/电话号",
            trigger: "blur"
          }
        ],
        detailedAddress: [
          {
            required: true,
            message: "请输入主要地址",
            trigger: "blur"
          }
        ]
      },
      dialogTitle: "",
      dialogFormVisible: false,
      productList: [],

      dialogProductFormVisible: false,
      productForm: {},

      isshowimg: false,
      nowimgurl: null
    };
  },
  computed: {
    ...mapGetters({
      judgePermission: "permission/judgePermission"
    }),
    headers() {
      return {
        accessToken: sessionStorage.getItem("token"),
        organizationNo: sessionStorage.organizationNo,
        sysDataBaseName: sessionStorage.databaseName
      };
    },
    uploadData() {
      return {
        organizationNo: sessionStorage.organizationNo
      };
    }
  },
  created() {
    this.getTableDataList();
  },
  mounted() {
    this.getProductList();
    // this.getCustomer()
  },
  methods: {
    // 展示图片
    showimgmet(e) {
      if (
        e.customerBusinessLicenseNoList &&
        e.customerBusinessLicenseNoList.length
      ) {
        customerManage
          .getImgByNo(e.customerBusinessLicenseNoList[0])
          .then(res => {
            this.nowimgurl = "data:image/png;base64," + res.data.pictureData;
            this.isshowimg = true;
          });
      } else {
        this.$message.warning("暂无图片");
      }
    },
    // 查询表格数据
    getTableDataList() {
      let param = {
        page: this.currentPage,
        size: this.pageSize,
        entity: {
          ...this.searchInfo
        }
      };
      customerManage.queryPageByCondition(param).then(res => {
        this.loading = false;
        let data = res.data;
        if (data) {
          this.totalSize = data.totalElements;
          this.tableData = data.content;
          this.tableData.forEach(item => {
            if (item.dizhi) {
              let site = item.dizhi.split(",", 3);
              item.site = site.join("") + item.detailedAddress;
            }
          });
          // dizhi.split('","', 3)
          this.addblankmet();
          this.resetActionBar();
          // this.getCustomer()
        }
      });
    },
    // 地址
    handleChange(value) {
      let name = "";
      this.selectedOptions.map(item => {
        console.log(CodeToText[item]);
        name += CodeToText[item] + ",";
      });
      this.addtions.names = name;
    },
    // 图片地址
    ImageUrl() {
      if (this.nowChanceStau === "edit" || this.nowChanceStau === "add") {
        let URL = `${baseURL.webServiceUrl}v3/sale/customerBusinessLicense/add`;
        return URL;
      } else {
        let URL = "#";
        // console.log(URL)
        return URL;
      }
    },
    handleResponse(response, file, fileList) {
      // return this.basicUrl + query/ + this.pictureNo
      this.pictureNo = response.data;
      customerManage.getImgByNo(this.pictureNo).then(res => {
        this.image = "data:image/png;base64," + res.data.pictureData;
      });
      return this.image;
    },
    handleRemove() {
      if (this.nowChanceStau === "edit") {
        // console.log(response);
        customerManage.delImg(this.pictureNo).then(res => {
          if (res.code === 1) {
            delete this.pictureNo;
            delete this.formData.pictureNo;
            this.$message.success(res.msg);
          }
        });
      } else {
        return this.$message.error("点击修改按钮再进行编辑!");
      }
    },
    search() {
      this.currentPage = 1;
      // console.log(this.customerId);
      this.getTableDataList();
    },
    changePageSize(pageSize) {
      this.pageSize = pageSize;
      this.getTableDataList();
    },
    changeCurrentPage(currentPage) {
      this.currentPage = currentPage;
      this.getTableDataList();
    },
    add() {
      this.formData = {};
      this.canInput = true;
      this.openDialog("add");
    },
    handleEdit(row) {
      // console.log(row);
      // TODO 点击行元素后 edit
      this.selectedOptions = [];
      this.formData = JSON.parse(JSON.stringify(row));
      if (this.formData.site) {
        delete this.formData.site;
      }
      if (row.address) {
        let dizhi = row.address.split(",", 3);
        this.selectedOptions = [
          TextToCode[dizhi[0]].code,
          TextToCode[dizhi[0]][dizhi[1]].code,
          TextToCode[dizhi[0]][dizhi[1]][dizhi[2]].code
        ];
      }
      this.pictureNo = row.customerBusinessLicenseNoList?.[0];
      if (this.pictureNo !== undefined) {
        customerManage.getImgByNo(this.pictureNo).then(res => {
          this.image = "data:image/png;base64," + res.data.pictureData;
        });
      } else {
        this.image = "";
      }
      // this.addActive = false;
      this.editActive = true;
      this.saveActive = false;
      this.cancelActive = true;
      this.canInput = false;
      this.openDialog("edit");
    },
    handleSelectionChange(list) {
      this.customerIdList = [];
      this.customerIdList = list.map(item => item.customerNo);
      // console.log(this.customerIdList);
      if (this.customerIdList.length > 0) this.delActive = true;
      else this.delActive = false;
    },
    delmessage() {
      customerManage.delSellOrderManageInfo(this.customerIdList).then(res => {
        if (res.code === 1) {
          this.$message.success(res.msg);
          this.getTableDataList();
        } else {
          this.$message.warning(res.msg || "删除失败");
        }
      });
    },
    handleDelete(row) {
      // customerManage.delList([row.customerNo]).then(res => {
      //   if (res.code === 1) {
      //     this.$message.success(res.msg);
      //     this.getTableDataList();
      //   } else {
      //     this.$message.warning(res.msg || '删除失败');
      //   }
      // });
      this.$confirm("此操作将永久删除该条数据, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        customClass: "myClass"
      })
        .then(() => {
          customerManage.delList([row.customerNo]).then(res => {
            if (res.code === 1) {
              this.$message.success(res.msg);
              this.getTableDataList();
            } else {
              this.$message.warning(res.msg || "删除失败");
            }
          });
        })
        .catch(() => {
          this.$message("取消删除");
        });
    },
    save(formData) {
      this.$refs[formData].validate(valid => {
        if (valid) {
          if (this.nowChanceStau === "edit") {
            this.formData.address = this.addtions.names;
            this.formData.customerBusinessLicenseNoList = this.pictureNo
              ? [this.pictureNo]
              : [];
            this.formData.customerProductConfigList = this.rightTableData;
            customerManage.edit(this.formData).then(res => {
              if (res.code === 1) {
                this.$message.success(res.msg || "修改成功！");
                this.selectedOptions = [];
                this.detailedAddress = "";
                this.$refs[formData].resetFields();
                this.closeDialog();
                this.getTableDataList();
              } else {
                this.$message.error(res.msg || "修改失败！");
              }
            });
          } else if (this.nowChanceStau === "add") {
            this.formData.address = this.addtions.names;
            this.formData.customerBusinessLicenseNoList = this.pictureNo
              ? [this.pictureNo]
              : [];
            this.formData.customerProductConfigList = this.rightTableData;
            customerManage.add(this.formData).then(res => {
              if (res.code === 1) {
                this.$message.success(res.msg || "新增成功！");
                this.selectedOptions = [];
                this.detailedAddress = "";
                this.$refs[formData].resetFields();
                this.closeDialog();
                this.getTableDataList();
              } else {
                this.$message.error(res.msg || "新增失败！");
              }
            });
          }
        } else {
          return false;
        }
      });
    },
    openDialog(type) {
      this.dialogFormVisible = true;
      this.dialogTitle = type === "add" ? "新增" : "编辑";
      this.nowChanceStau = type;
    },
    closeDialog() {
      this.dialogFormVisible = false;
      this.dialogTitle = null;
      this.nowChanceStau = "";
    },

    // 获取产品列表
    getProductList() {
      productManage.queryByCondition().then(res => {
        this.productList = res.data;
      });
    },
    // 点击添加按按钮
    addButInfo() {
      let list = {
        goodsName: "",
        goodsNo: "",
        model: "",
        perSpecUnitName: "",
        perSpecUnitNo: "",
        quantityUnitName: "",
        quantityUnitNo: "",
        specification: 0,
        totalAmount: 0,
        unitName: "",
        unitNo: "",
        unitPrice: 0
      };
      this.rightTableData.unshift(list);
    },
    // 删除改行
    deleteRow(index, rows) {
      rows.splice(index, 1);
    },
    chooseProduct(scope) {
      let obj = this.productList.find(
        data => data.productNo === scope.row.goodsNo
      );
      obj.goodsName = obj.productName;
      obj.goodsNo = obj.productNo;
      this.$set(this.rightTableData, scope.$index, obj);
    },
    checkProductList(item, type) {
      this.dialogProductFormVisible = true;
      this.productForm = JSON.parse(JSON.stringify(item));
      customerManage.queryByCustomerNo(item.customerNo).then(res => {
        if (res.code !== 1) {
          return;
        }
        this.canInput = type;
        this.rightTableData = res.data || [];
      });
    },
    closeCheckProduct() {
      this.dialogProductFormVisible = false;
    },
    saveProduct() {
      this.productForm.address = this.addtions.names;
      this.productForm.customerBusinessLicenseNoList = this.pictureNo
        ? [this.pictureNo]
        : [];
      this.productForm.customerProductConfigList = this.rightTableData;
      customerManage.edit(this.productForm).then(res => {
        if (res.code === 1) {
          this.$message.success(res.msg || "修改成功！");
          this.dialogProductFormVisible = false;
          this.selectedOptions = [];
          this.detailedAddress = "";
          // this.$refs[productForm].resetFields()
        } else {
          this.$message.error(res.msg || "修改失败！");
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
@import "~@/styles/variables.scss";

::v-deep .el-form-item__label {
  min-width: 120px !important;
}
.search-item {
  display: flex;
  height: 36px;
  margin-left: 20px;
  white-space: nowrap;
  &:first-child {
    margin: 0;
  }
  span {
    display: inline-block;
  }
  &.rules-wrap span {
    padding: 0 15px;
    border: 1px solid $borderColor;
    cursor: pointer;
    transition: border-color 0.2s;
    box-sizing: border-box;
    &:hover {
      border-color: #6ecae3;
    }
  }
}

.el-date-editor,
.el-select {
  width: 100%;
}

h4.total-price {
  display: flex;
  justify-content: space-between;
  margin: 0;
}

.right-table {
  line-height: 0px;
}
.adress {
  ::v-deep .el-form-item__content {
    flex-wrap: wrap;
    .el-cascader {
      font-size: 10px;
      // height: 20px;
      // line-height: 22px;
      width: 100%;
      .el-input__inner {
        font-size: 10px;
        height: 30px;
      }
    }
  }
}

// 上传图片
::v-deep .el-upload--picture-card {
  width: 40px;
  height: 40px;
  background-color: rgba(255, 255, 255, 0.1);
  border: 1px solid #6ecae3;
}
::v-deep .el-upload--picture-card {
  position: relative;
}
::v-deep .el-upload--picture-card .el-icon-plus {
  font-size: 34px;
  color: #6ecae3;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.addInfo {
  width: 100%;
}
</style>
